<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<style type="text/css">
		.box{
			width:1583px;
			height: 56px;
			/*border: 1px solid blue; */
		}
		.loge{
			width: 70px;
			height: 32px;
			margin-right: 16px;
			float: left;
		}
		ul{
			float: left;
		}
		li{
			list-style: none;
			text-shadow: none;
			color: #212121;
			font-size: 14px;
			line-height: 32px;
            float: left;
            margin-left: 15px;
			
		}
		input{
			width: 500px;
			height: 34px;
			background-color: transparent;
            color: #999;
            font-size: 14px;
            margin-left: 50px; 
		}
		form{
			/*border: 1px solid blue;*/
			margin-top: 10px;
			float: left;
		
		}
		.item .name{
             color: #212121;
             text-shadow: none;
		}
		.name{
            text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
            font-size: 14px;
            white-space: nowrap;
            display: flex;
            align-items: center;
            white-space: nowrap;
            float: left;
            margin-left: 50px;
            line-height:50px;

		}
		.mini-upload[data-v-0fdc0c18] {
        font-size: 14px;
        display: block;
        width: 100px;
        height: 36px;
        line-height: 36px;
        text-align: center;
        background: #FB7299;
        border-radius: 2px;
        margin-left: 30px;
        float: left;
      }
      .d1{
        /*border: 1px solid red;*/
      	background: #00a0d8;
      	text-align: center;
      	margin:10px auto;
		}
	 .title-line {
       width: 980px;
       height: 28px;
       margin: 0 auto;
       border-bottom: 1px solid #ddd;
       margin-bottom: 28px;
       text-align: center;
       }
       .d2{
       	/*border: 1px solid;*/
       	float: left;
       	text-align: center;
       	margin-left: 330px;
       }  
       .d4{
       	text-align: center;
       }
       .d5{
        width: 1590px;
       	height: 150px;
       	/*border: 1px solid blue;*/
       	background: 000;
       	line-height: 0px;
       }
       .d6{
          width: 1590px;
       	  height: 410px; 
       	  background: #f6f9fa;
       }
     

	</style>
	<title></title>
</head>
<body>
	<div class="box">
		<div class="loge">
			<img src="360截图20210311085901737.jpg">
		</div>
		<ul>
			<li>
				<a href="">主站</a>
			</li>
			<li>
				<a href="https://www.bilibili.com/anime/?spm_id_from=333.851.b_696e7465726e6174696f6e616c486561646572.2">番剧</a>
			</li>
			<li>
				<a href="https://game.bilibili.com/platform/?spm_id_from=333.851.b_696e7465726e6174696f6e616c486561646572.3">游戏中心</a>
			</li>
			<li>
				<a href="https://live.bilibili.com/?spm_id_from=333.851.b_696e7465726e6174696f6e616c486561646572.4">直播</a>
			</li>
			<li>
				<a href="https://show.bilibili.com/platform/home.html?msource=pc_web&spm_id_from=333.851.b_696e7465726e6174696f6e616c486561646572.5">会员购</a>
			</li>
			<li>
				<a href="https://manga.bilibili.com/?from=bill_top_mnav&spm_id_from=333.851.b_696e7465726e6174696f6e616c486561646572.6">漫画</a>
			</li>
			<li>
				<a href="https://www.bilibili.com/v/game/match/?spm_id_from=333.851.b_696e7465726e6174696f6e616c486561646572.7">赛事</a>
			</li>
			<li class="nav-link-item">
				<span>
					<a href="//app.bilibili.com" target="_blank" class="link van-popover__reference" aria-describedby="van-popover-7826" tabindex="0"><i class="bilifont bili-icon_dingdao_xiazaiapp"></i>下载APP</a>
				</span>
			</li>
		</ul>
		<form>
			<input type="text" name="" placeholder="你愿意做我啵爸">
		</form>
		<span data-v-2f2b93e8="" class="name">登录
      </span>
      <div class="item"><a href="//passport.bilibili.com/register/phone.html" class="txt name">注册</a></div>
        <span data-v-0fdc0c18="" class="mini-upload van-popover__reference" aria-describedby="van-popover-1977" tabindex="0">
      投稿</span>
  
  </div>

    

    <div class="d1">
    	<img src="1.jpg">
    </div>
    <div data-v-2c844fd9="" class="title-line"><span class="tit" style="font-size: 38px;">登录</span></div>
    
     <div class="d2">
     	<img src="2.jpg">
     </div>
    <div data-v-2c844fd9="" class="login-right">
    	<div data-v-2c844fd9="" class="form-login">
    		<div id="geetest-wrap" class="input-box">
    			<div>
    				<div class="type-tab" style="color: blue;"><span class="active">密码登录</span> <span class="" style="color:black;">短信登录</span></div> 
    				<div>

    					<div class="item username status-box">
    						<input style="margin-left:-5px;" type="text" value="" placeholder="你的手机号/邮箱" id="login-username" maxlength="50" autocomplete="off" class=""> <span class="status"></span>
    						 <div class="text clearfix"><p class="tips"></p></div> 
    					</div> 

    					<div class="item password status-box" >
    						<input type="password" placeholder="密码" id="login-passwd" class="" style=" margin-left: -5px;"> <span class="status"></span> 
    						<div class="text clearfix"><p class="tips"></p></div>
    					</div>  

    					<div class="item gc clearfix"></div></div> 
    				<div style="display: none;"></div></div></div>" 
    		<button type="button" class="el-button captcha-buttom el-button--primary"><!----><!----><span>获取验证码</span></button> <span class="status"></span></div> 
    	<div class="text clearfix"><p class="tips"></p></div></div> 
    <div class="remember" style=""><div class="remember-tool">
    	<p style="">
    		<label data-v-5641f300="" class="remember-check checkbox-bwxr active">
    		<input data-v-5641f300="" type="checkbox" style="width: 16px; height:16px;font-size: 5px;">
    		</label>
              <span style="">记住我</span>
              <span style="font-size: 8px;">不是自己的电脑上不要勾选此项</span>
        </p> 

        <div><a target="_blank" href="//passport.bilibili.com/register/findpassword.html#/verify" class="forget-password" style="color: #00a1d6;font-size: 8px;">忘记密码?</a> <a target="_blank" href="//www.bilibili.com/blackboard/help.html#%E8%B4%A6%E5%8F%B7%E7%9B%B8%E5%85%B3" class="not-checkout"
              	style="color: #00a1d6;font-size: 8px;">无法验证?</a></div>

        </div></div> 

        <div class="btn-box"></div>
        <div class="d4" >
        		<input type="sumbit" name="" placeholder="登录" style="background:#00a1d6 ;width: 150px; ">
        		<input type="reset" name="" placeholder="注册" style="background:#00a1d6; width: 150px;  " >
</div>
        
        <div class="d5" ></div>
        <div class="d6"> 
             <img src="3.jpg">
                  </div>
   

</body>
</html>